<!DOCTYPE html>
<html>
<head>
    <title>门店耗材入库表</title>
    <#include "/header.html">
    <!-- 文件上传 -->
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/oss/style.css">
    <script type="text/javascript" src="${request.contextPath}/statics/plugins/oss/js/plupload.full.min.js"></script>
    <script type="text/javascript" src="${request.contextPath}/statics/plugins/oss/ziyun_library.js"></script>
    <!-- 图片预览 -->
    <link rel="stylesheet" href="${request.contextPath}/statics/plugins/viewer/viewer.min.css">
    <script src="${request.contextPath}/statics/plugins/viewer/viewer.min.js"></script>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <form class="form-inline" role="form">
                <a class="btn btn-default btn-sm" @click="reset"><i class="fa fa-refresh"></i></a>
                <div class="form-group">
                    <input type="text" class="form-control input-sm" v-model.trim="q.inNo" @keyup.enter="query" placeholder="单据号">
                </div>&nbsp;&nbsp;&nbsp;
                <!--<#if shiro.hasPermission("storeMaterials:storematerialin:save")>-->
                <a class="btn btn-primary btn-sm" @click="addIn"><i class="fa fa-plus"></i>&nbsp;新增入库</a>
                <!--<a class="btn btn-primary btn-sm" @click="profit"><i class="fa fa-plus"></i>&nbsp;盘盈</a>-->
                <a class="btn btn-default btn-sm"  @click="query"><i class="fa fa-search"></i>&nbsp;查询</a>
                <!--</#if>-->
            </form>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>
    <!-- 入库登记 start -->
    <div v-show="showListFalse" class="panel panel-default" align="center">
        <div class="panel-heading text-left">新增入库</div>
        <el-form ref="form" :model="storeMaterialForm" label-width="80px" size="small">
            <div class="row" style="line-height:100px;font-size: 12px;">
                <div class="col-md-4">
                    <div class="col-md-2 text-left">入库单号 ：</div>
                    <div class="col-md-10">
                        <el-input placeholder="请输入单据号" v-model.trim="storeMaterialForm.storeMaterialInEntity.inNo" class="input-with-select" size="small">
                            <el-select v-model="storeMaterialForm.storeMaterialInEntity.type" @change="clearStore" slot="prepend" placeholder="请选择入库类型">
                                <el-option v-for="item in e.storeMaterialInTypeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
                            </el-select>
                            <el-button slot="append" icon="el-icon-search"  @click="searchInNo"></el-button>
                        </el-input>
                    </div>
                </div>
                <div class="col-md-2">
                    <div class="col-md-5 text-right">是否含税 ：</div>
                    <div class="col-md-7 text-right">
                        <el-select v-model="storeMaterialForm.storeMaterialInEntity.tax" placeholder="是否含税" size="small">
                            <el-option v-for="item in e.taxTypeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
                        </el-select>
                    </div>
                </div>
                <div v-if="storeMaterialForm.storeMaterialInEntity.type == 1" class="col-md-3">
                    <div class="col-md-3 text-right">采购备注 ：</div>
                    <div class="col-md-9 text-right">
                        <el-input placeholder="请输入内容" v-model="storeMaterialForm.storeMaterialInEntity.applyRemark" size="small"></el-input>
                    </div>
                </div>
                <div v-if="storeMaterialForm.storeMaterialInEntity.type == 1" class="col-md-3">
                    <div class="col-md-3 text-right">审核备注 ：</div>
                    <div class="col-md-9 text-right">
                        <el-input placeholder="请输入内容" v-model="storeMaterialForm.storeMaterialInEntity.auditRemark" size="small"></el-input>
                    </div>
                </div>
                <div v-if="storeMaterialForm.storeMaterialInEntity.type == 7" class="col-md-3">
                    <div class="col-md-3 text-right">调拨出库备注:</div>
                    <div class="col-md-9 text-right">
                        <el-input placeholder="请输入内容" v-model="storeMaterialForm.storeMaterialInEntity.outRemark" size="small"></el-input>
                    </div>
                </div>
                <div v-if="storeMaterialForm.storeMaterialInEntity.type == 2" class="col-md-3">
                    <div class="col-md-3 text-right">红冲备注 ：</div>
                    <div class="col-md-9 text-right">
                        <el-input placeholder="请输入内容" v-model="storeMaterialForm.storeMaterialInEntity.outRemark" size="small"></el-input>
                    </div>
                </div>
                <!--<div v-if="storeMaterialForm.storeMaterialInEntity.type == 2" class="col-md-3">-->
                    <!--<div class="col-md-3 text-right">红冲备注 ：</div>-->
                    <!--<div class="col-md-9 text-right">-->
                        <!--<el-input placeholder="请输入内容" v-model="storeMaterialForm.storeMaterialInEntity.outRemark" size="small"></el-input>-->
                    <!--</div>-->
                <!--</div>-->
            </div>
            <div class="row" style="line-height:30px;font-size: 12px;" >
                <el-table :data="storeMaterialForm.storeMaterialInDetailEntityList" height="500" border style="width: 98%" size="mini">
                    <el-table-column prop="materialId" label="耗材id" width="80" align="center"></el-table-column>
                    <el-table-column prop="materialName" label="耗材名称" width="280" align="center"></el-table-column>
                    <el-table-column prop="materialQuantity" v-if="storeMaterialForm.storeMaterialInEntity.type === '7'?true:false" label="数量"  width="80" align="center"></el-table-column>
                    <!--<el-table-column prop="unit" label="单位" :formatter="formatUnit" width="100" align="center"></el-table-column>-->
                    <el-table-column prop="showUnit" label="单位"  width="100" align="center"></el-table-column>
                    <el-table-column prop="length" label="长"  width="100" align="center"></el-table-column>
                    <el-table-column prop="width" label="宽"  width="100" align="center"></el-table-column>
                    <el-table-column prop="specifications" label="规格"  width="100" align="center"></el-table-column>
                    <el-table-column prop="materialModel" label="型号"  width="100" align="center"></el-table-column>
                    <el-table-column prop="weight" label="重量"  width="100" align="center"></el-table-column>
                    <el-table-column prop="unitMoney" label="单价" width="120" align="center"></el-table-column>
                    <el-table-column prop="totalMoney" label="总价" width="120" align="center"></el-table-column>
                    <el-table-column prop="supplierId" label="供应商ID" width="120" align="center" v-if="false"></el-table-column>
                    <el-table-column label="供应商" v-if="storeMaterialForm.storeMaterialInEntity.type === '7'?true:false" width="180" header-align="center">
                        <template slot-scope="scope">
                            <el-select v-model="scope.row.supplierId" filterable placeholder="请选择" size="mini">
                                <el-option
                                        v-for="item in e.materialSupplier"
                                        :key="item.msId"
                                        :label="item.msName"
                                        :value="item.msId">
                                </el-option>
                            </el-select>
                        </template>
                    </el-table-column>
                    <el-table-column prop="" label="入库数量" width="150" align="center">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.materialQuantity" size="mini" @change="changeInput(scope.row.quantity,materialQuantity)" type="number" min="0"></el-input>
                        </template>
                    </el-table-column>
                    <el-table-column prop="" label="备注" align="center">
                        <template slot-scope="scope">
                            <el-input v-model="scope.row.remark" size="mini"></el-input>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
            <el-form-item style="margin-top: 6px;margin-bottom: 6px;">
                <el-button type="primary" @click="save">确认入库</el-button>
                <el-button @click="showList = true;showListFalse = false">返&nbsp;&nbsp;回</el-button>
            </el-form-item>
        </el-form>
    </div>
    <!-- 入库登记 end -->

    <!-- 审核提示框 start -->
    <el-dialog title="提示" :visible.sync="auditDialogVisible" width="25%">
        <span>{{auditOrRejectData.msg}}</span>
        <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="auditOrReject" size="small">确 定</el-button>
            <el-button @click="auditDialogVisible = false" size="small">取 消</el-button>
         </span>
    </el-dialog>
    <!-- 审核提示框 end -->

    <!-- ----------------------------------------------------------盘盈开始---------------------------------------------------------------------------  -->
    <div v-show="profitDiv">
        <el-container style="height: 710px; border: 1px solid #eee">
            <!-- 耗材信息 start -->
            <el-aside width="45%" style="border-right:1px solid #c0c4cc; ">
                <el-container style="height: 100%;">
                    <el-header style="height: 40px">耗材信息</el-header>
                    <!-- 分类树 start -->
                    <el-container style="height: 100%;">
                        <el-aside width="22%" style="border-right:1px solid #eee; padding: 20px;">
                            <el-input
                                    placeholder="输入关键字查找分类"
                                    size="mini"
                                    v-model="materialCategorySearch">
                            </el-input>
                            <el-tree
                                    class="filter-tree"
                                    :data="materialCategoryList"
                                    :props="defaultProps"
                                    default-expand-all
                                    :filter-node-method="filterNode"
                                    :expand-on-click-node="false"
                                    @node-click="materialsSearch"
                                    ref="tree2">
                            </el-tree>
                        </el-aside>
                        <!-- 分类树 end -->
                        <!-- 耗材 start -->
                        <el-main>
                            <el-form :inline="true" :model="materialSearchForm" class="demo-form-inline" size="mini">
                                <el-form-item >
                                    <el-input v-model="materialSearchForm.materialName" @keyup.enter="materialsSearch" placeholder="耗材名称"></el-input>
                                </el-form-item>
                                <el-form-item>
                                    <el-button type="primary" @click="materialsSearch">查询</el-button>
                                </el-form-item>
                            </el-form>
                            <el-table border stripe ref="multipleTable" :data="materialTableData"  style="height: 80%;"
                                      tooltip-effect="dark" size="mini">
                                <el-table-column prop="materialId" label="ID" width="50" align="center"></el-table-column>
                                <el-table-column prop="materialName" label="耗材名称" header-align="center" show-overflow-tooltip></el-table-column>
                                <el-table-column prop="length" label="长(m)" width="60" header-align="center" header-align="center"></el-table-column>
                                <el-table-column prop="width" label="宽(m)" width="60" header-align="center" header-align="center"></el-table-column>
                                <el-table-column prop="weight" label="克重" width="60" header-align="center" header-align="center"></el-table-column>
                                <el-table-column prop="specifications" label="型号/规格" width="90" header-align="center"></el-table-column>
                                <el-table-column prop="unit" label="单位" width="45" :formatter="formatUnit" align="center"></el-table-column>
                                <el-table-column prop="categoryName" label="分类" width="70" header-align="center"></el-table-column>
                                <el-table-column label="操作" width="50" align="center">
                                    <template slot-scope="scope">
                                        <el-button @click="addMaterial(scope.row)" type="text" size="small">添加</el-button>
                                    </template>
                                </el-table-column>
                            </el-table>
                            <div class="block text-right">
                                <el-pagination
                                        @size-change="handleSizeChange"
                                        @current-change="handleCurrentChange"
                                        :current-page="1"
                                        :page-sizes="[page.size, 2*page.size, 4*page.size]"
                                        :page-size="page.size"
                                        :total="page.total">
                                </el-pagination>
                            </div>
                        </el-main>
                    </el-container>
                    <!-- 耗材 end -->
                </el-container>
            </el-aside>
            <!-- 耗材信息 end -->
            <!-- 盘盈耗材信息 start -->
            <el-main>
                <el-form ref="form" :model="purchaseApplyForm" label-width="80px" size="mini">
                    <el-table border stripe ref="multipleTable" :data="purchaseApplyForm.storePurchaseApplyDetailEntityList" style="margin-bottom: 20px;"
                              tooltip-effect="dark" size="mini">
                        <el-table-column type="index" width="50" label="序号" align="center"> </el-table-column>
                        <el-table-column prop="materialId" label="耗材ID" width="60" align="center"></el-table-column>
                        <el-table-column prop="materialName" label="耗材名称" header-align="center" show-overflow-tooltip></el-table-column>
                        <el-table-column prop="specifications" label="型号/规格" width="100" header-align="center"></el-table-column>
                        <el-table-column prop="length" label="长" width="70" header-align="center"></el-table-column>
                        <el-table-column prop="width" label="宽" width="70" header-align="center"></el-table-column>
                        <el-table-column prop="weight" label="克重" width="60" header-align="center"></el-table-column>
                        <el-table-column prop="unit" label="单位" width="50" :formatter="formatUnit" align="center"></el-table-column>
                        <el-table-column label="数量" width="100" align="center">
                            <template slot-scope="scope">
                                <el-input type="number"
                                          v-model="scope.row.materialQuantity"
                                          size="mini"
                                          min="1"
                                          max="10000"
                                          @change="totalMoneyChange(scope.row,scope.$index)">
                                </el-input>
                            </template>
                        </el-table-column>
                        <el-table-column prop="unitMoney" label="单价" width="60" align="center"></el-table-column>
                        <el-table-column label="总价" width="110" align="center">
                            <template slot-scope="scope">
                                <el-input type="number"
                                          v-model="scope.row.totalMoney"
                                          size="mini"
                                          min="0"
                                          max="100000"
                                          @change="totalMoneyChange(scope.row,scope.$index)">
                                </el-input>
                            </template>
                        </el-table-column>
                        <!--<el-table-column label="采购商" width="140" header-align="center">-->
                            <!--<template slot-scope="scope">-->
                                <!--<el-select v-model="scope.row.supplierId" filterable placeholder="请选择" size="mini">-->
                                    <!--<el-option-->
                                            <!--v-for="item in e.materialSupplier"-->
                                            <!--:key="item.msId"-->
                                            <!--:label="item.msName"-->
                                            <!--:value="item.msId">-->
                                    <!--</el-option>-->
                                <!--</el-select>-->
                            <!--</template>-->
                        <!--</el-table-column>-->
                        <el-table-column label="操作" width="50" align="center">
                            <template slot-scope="scope">
                                <el-button @click="removePurchaseMaterials(scope.row,scope.$index)" type="text" size="small">删除</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                    <el-col :span="12">
                        <el-form-item label="总金额：" size="mini" label-width="120px">
                            <el-input v-model="purchaseApplyForm.storePurchaseApplyEntity.totalMoney" readonly="true"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="是否含税：" size="mini" label-width="120px" :span="12">
                            <el-select v-model="purchaseApplyForm.storePurchaseApplyEntity.tax" filterable placeholder="请选择" size="mini">
                                <el-option
                                        v-for="item in e.taxEnum"
                                        :key="item.value"
                                        :label="item.label"
                                        :value="item.value">
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col>
                        <el-form-item label="盘盈备注:" size="mini" label-width="120px">
                            <el-input type="textarea" v-model="purchaseApplyForm.storePurchaseApplyEntity.applyRemark"></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col class="text-center">
                        <el-form-item>
                            <el-button type="primary" @click="onSubmit">提交申请</el-button>
                            <el-button @click="showList = true;showListFalse = false;profitDiv = false">返 回</el-button>
                        </el-form-item>
                    </el-col>
                </el-form>
            </el-main>
            <!-- 盘盈耗材信息 end -->
        </el-container>
    </div>
    <!-- ----------------------------------------------------------盘盈结束---------------------------------------------------------------------------  -->
    <div v-show="!showDetail" class="panel panel-default">
        <el-row>
            <el-card class="box-card">
                <div slot="header" class="clearfix">
                    <span>入库明细</span>
                </div>
                <div class="text item">
                    <div class="row" style="line-height:30px;font-size: 12px;">
                        <div class="col-md-2">
                            <div class="col-md-6 text-right">入库单号：</div>
                            <div class="col-md-6">{{purchaseApplyForm.storePurchaseApplyEntity.inNo}}</div>
                        </div>
                        <div class="col-md-2">
                            <div class="col-md-5 text-right">入库仓库名称 ：</div>
                            <div class="col-md-7">{{purchaseApplyForm.storePurchaseApplyEntity.stockName}}</div>
                        </div>
                        <div class="col-md-2">
                            <div class="col-md-6 text-right">申请人 ：</div>
                            <div class="col-md-6">{{purchaseApplyForm.storePurchaseApplyEntity.createName}}</div>
                        </div>
                        <div class="col-md-2">
                            <div class="col-md-5 text-right">申请时间 ：</div>
                            <div class="col-md-7">{{purchaseApplyForm.storePurchaseApplyEntity.createTime}}</div>
                        </div>
                    </div>
                </div>
            </el-card>
        </el-row>
        <el-row>
            <el-card class="box-card">
                <div class="text item">
                    <el-form ref="form" :model="purchaseApplyForm" label-width="80px" size="mini">
                        <el-table border stripe ref="multipleTable" :data="purchaseApplyForm.storePurchaseApplyDetailEntityList" style="margin-bottom: 20px;"
                                  tooltip-effect="dark" size="mini">
                            <el-table-column type="index" width="60" label="序号" align="center"> </el-table-column>
                            <el-table-column prop="materialId" label="耗材ID" width="80" align="center"></el-table-column>
                            <el-table-column prop="materialName" label="耗材名称" header-align="center" show-overflow-tooltip></el-table-column>
                            <el-table-column prop="specifications" label="规格" width="200" align="center"></el-table-column>
                            <el-table-column prop="materialModel" label="型号" width="200" align="center"></el-table-column>
                            <!--<el-table-column prop="unit" label="单位" width="100" :formatter="formatUnit" align="center"></el-table-column>-->
                            <el-table-column prop="showUnit" label="单位" width="100"  align="center"></el-table-column>
                            <el-table-column prop="materialQuantity" label="数量" width="100" align="center"></el-table-column>
                            <el-table-column prop="length" label="长" width="100" align="center"></el-table-column>
                            <el-table-column prop="width" label="宽" width="100" align="center"></el-table-column>
                            <el-table-column prop="weight" label="克重" width="100" align="center"></el-table-column>
                            <el-table-column prop="unitMoney" label="单价" width="100" align="center"></el-table-column>
                            <el-table-column prop="totalMoney" label="总价" width="200" align="center">
                                <!--<template slot-scope="scope">-->
                                    <!--<el-input type="number"-->
                                              <!--v-model="scope.row.totalMoney"-->
                                              <!--size="mini"-->
                                              <!--min="0"-->
                                              <!--max="100000"-->
                                              <!--@change="totalMoneyChange(scope.row,scope.$index)">-->
                                    <!--</el-input>-->
                                <!--</template>-->
                            </el-table-column>
                        </el-table>
                        <el-col :span="12">
                            <el-form-item label="出库总金额：" size="mini" label-width="120px">
                                {{purchaseApplyForm.storePurchaseApplyEntity.totalMoney}}
                                <!--<el-input v-model="purchaseApplyForm.storePurchaseApplyEntity.totalMoney" readonly="true"></el-input>-->
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="是否含税：" size="mini" label-width="120px" :span="12">
                                <el-select disabled v-model="purchaseApplyForm.storePurchaseApplyEntity.tax" filterable placeholder="请选择" size="mini">
                                    <el-option
                                            v-for="item in e.taxEnum"
                                            :key="item.value"
                                            :label="item.label"
                                            :value="item.value">
                                    </el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                        <el-col class="text-center">
                            <el-form-item>
                                <el-button @click="close">返 回</el-button>
                            </el-form-item>
                        </el-col>
                    </el-form>
                </div>
            </el-card>
        </el-row>
    </div>
    <!-- 入库单据浏览上传弹窗 -->
    <el-dialog id="view" title="提示" :visible.sync="otherAccessoryDialog"  @close="reloadDialog()" width="75%" >
        <el-table :data="otherAccessoryList" border>
            <el-table-column type="index" label="序号" width="50" header-align="center" align="center"></el-table-column>
            <el-table-column property="name" label="图片名" width="350"></el-table-column>
            <el-table-column label="图片(点击可预览)" align="center" width="120">
                <template  slot-scope="scope">
                    <img :src="'https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/'+scope.row.imageUrl" style="width: 100px">
                </template>
            </el-table-column>
            <el-table-column property="createTime" label="创建时间"></el-table-column>
            <el-table-column  label="操作">
                <template slot-scope="scope">
                    <el-button @click="delOtherAccessory(scope.row.id)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
        <!--<div id = "view">-->
            <!--<div v-for="(id,index) in ids">-->
                <!--<img :src="'https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/'+ids[index]" style="width: 200px" />-->
            <!--</div>-->
            <!--<img :src="'https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/'+ids[0]" style="width: 200px" />-->
            <!--<img :src="'https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/'+ids[1]" style="width: 200px" />-->
            <!--&lt;!&ndash;<img class = "view" :src="'https://ziyunoss.oss-cn-hangzhou.aliyuncs.com/product/picsotre/materialin/images/1544754034189.jpg'" style="width: 200px" >&ndash;&gt;-->
        <!--</div>-->

        <div slot="footer" class="dialog-footer">
            <el-button type="primary" id="upload" >上传新单据</el-button>
            <el-button  @click="cancel()" >取消</el-button>
            <el-button  @click="saveOtherAccessory()">保存</el-button>
        </div>
    </el-dialog>
</div>

<script src="${request.contextPath}/statics/js/modules/storeMaterials/storematerialin.js?_${.now?long}"></script>
<style>
    .el-select .el-input {
        width: 150px;
    }
    .input-with-select .el-input-group__prepend {
        background-color: #fff;
    }
     .el-header{
         background-color: #ebeef5;
         color: #333;
         text-align: left;
         line-height: 40px;
         font-size: 12px;
     }
    .el-form-item__label {
        font-size: 12px;
    }
    .el-tree-node__label {
        font-size: 12px;
    }
    .el-pagination button, .el-pagination span:not([class*=suffix]) {
        font-size: 12px;
    }
    .el-table--mini td{
        padding: 0px 0px;
    }
</style>
</body>
</html>